<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
	<th:block th:include="include :: header('客户订单-出库')" />
	<th:block th:include="include :: datetimepicker-css" />
	<th:block th:include="include :: bootstrap-editable-css" />
</head>
<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-order-edit"
			th:object="${crmOrder}">
			<h4 class="form-header h4">基本信息</h4>
			<input name="orderId" th:field="*{orderId}" type="hidden"> 
			<input name="customerId" type="hidden" id="customerId" />
			<div class="row">
				<div class="col-sm-6">
					<div class="form-group">
						<label class="col-sm-4 control-label is-required">主题：</label>
						<div class="col-sm-8">
							<div class="form-control-static" th:text="${crmOrder.orderName}"></div>
						</div>
					</div>
				</div>
				<div class="col-sm-6">
					<div class="form-group">
						<label class="col-sm-4 control-label is-required">成交客户：</label>
						<div class="col-sm-8">
							<div class="form-control-static" th:text="${crmOrder.customer.customerName}"></div>
						</div>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-sm-6">
					<div class="form-group">
						<label class="col-sm-4 control-label is-required">成交总额：</label>
						<div class="col-sm-8">
							<div class="form-control-static" th:text="${crmOrder.totalPrice}"></div>
						</div>
					</div>
				</div>
				<div class="col-sm-6">
					<div class="form-group">    
		                <label class="col-sm-4 control-label is-required">总成本：</label>
		                <div class="col-sm-8">
		                    <div class="form-control-static" th:text="${crmOrder.costPrice}"></div>
		                </div>
		            </div>
				</div>
			</div>			
			<div class="row">
				<div class="col-sm-6">
					<div class="form-group">    
		                <label class="col-sm-4 control-label is-required">成交/签约时间：</label>
		                <div class="col-sm-8">
		                    <div class="form-control-static" th:text="${#dates.format(crmOrder.orderDate, 'yyyy-MM-dd')}" ></div>
		                </div>
		            </div>
				</div>
				<div class="col-sm-6">
					<div class="form-group">    
		                <label class="col-sm-4 control-label">付款方式：</label>
		                <div class="col-sm-8">
		                    <!-- <select name="payType" class="form-control m-b" th:with="type=${@dict.getType('pay_type')}">
		                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{payType}"></option>
		                    </select> -->
		                </div>
		            </div>
				</div>
			</div>			
			<div class="row">
				<div class="col-sm-6">
					<div class="form-group">    
		                <label class="col-sm-4 control-label is-required">有效期开始时间：</label>
		                <div class="col-sm-8">
		                    <div class="form-control-static" th:text="${#dates.format(crmOrder.validStart, 'yyyy-MM-dd')}" ></div>
		                </div>
		            </div>
				</div>
				<div class="col-sm-6">
					<div class="form-group">    
		                <label class="col-sm-4 control-label is-required">有效期结束时间：</label>
		                <div class="col-sm-8">
		                    <div class="form-control-static" th:text="${#dates.format(crmOrder.validEnd, 'yyyy-MM-dd')}" ></div>
		                </div>
		            </div>
				</div>
			</div>		
			
			<div class="row">
				<div class="col-sm-6">
					 <div class="form-group">    
		                <label class="col-sm-4 control-label">付款状态：</label>
		                <div class="col-sm-8">
							<div class="form-control-static" th:text="${@dict.getLabel('order_status', crmOrder.orderStatus)}"></div>
						</div>
		            </div>
				</div>
				<div class="col-sm-6">
					 <div class="form-group">    
		                <label class="col-sm-4 control-label">出库状态：</label>
		                <div class="col-sm-8">
							<div class="form-control-static" th:text="${@dict.getLabel('order_out_status', crmOrder.orderOutStatus)}"></div>
						</div>
		            </div>
				</div>
			</div>			
			
			<div class="row">
				<div class="col-sm-6">
					<div class="form-group">
						<label class="col-sm-4 control-label">合同ID：</label>
						<div class="col-sm-8">
							<div class="form-control-static" th:text="${crmOrder.contractId}"></div>
						</div>
					</div>
				</div>
			</div>			
			<div class="row">
				<div class="col-sm-12">
					<div class="form-group">
						<label class="col-xs-2 control-label">备注：</label>
						<div class="col-xs-10">
							<div class="form-control-static" th:text="${crmOrder.remark}"></div>
						</div>
					</div>
				</div>
			</div>
		</form>
		<h4 class="form-header h4">产品信息</h4>
		<div class="container-div">
			<div class="row">		
				<div class="col-sm-12 select-table table-striped">
					<table id="bootstrap-table"></table>
				</div>
			</div>
		</div>
	</div>
	<div class="row">
        <div class="col-sm-offset-5 col-sm-10">
            <button type="button" class="btn btn-sm btn-primary" onclick="orderOut()"><i class="fa fa-check"></i>出库</button>&nbsp;
            <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button>
        </div>
    </div>
	<th:block th:include="include :: footer" />
	<th:block th:include="include :: datetimepicker-js" />
	<th:block th:include="include :: bootstrap-table-editable-js" />
	<script th:inline="javascript">
		var productCategoryDatas = [[${@dict.getType('product_category')}]];
		var orderProductStatusDatas = [[${@dict.getType('order_product_status')}]];
		var prefix = ctx + "crm/order";
		var prefixProduct = ctx + "crm/product";
		var prefixOrderProduct =  ctx + "crm/orderProduct";
		var orderId=[[${orderId}]];
		
		$("#form-order-edit").validate({
			focusCleanup : true
		});
		
		$(function() {
            var options = {
                url: prefixOrderProduct + "/listAll",
                removeUrl: prefixOrderProduct + "/remove",
                showSearch: false,
		        showRefresh: false,
		        showToggle: false,
		        showColumns: false,
		        showPageGo: true,
		        onEditableSave: onEditableSave,
                modalName: "关联产品信息",
                queryParams : {
                    orderId:orderId
				},
                columns: [
                {
                    field : 'orderProductId', 
                    title : '订单产品ID',
                    visible: false
                },
		        {
                    title: "序号",
                    formatter: function (value, row, index) {
                 	    return $.table.serialNumber(index);
                    }
                },
                {
                    field : 'orderId', 
                    title : '订单id',
                    visible: false
                },
                {
                    field : 'productId', 
                    title : '产品id',
                    visible: false
                },
                {
                    field : 'product.productName', 
                    title : '产品名称'
                },
                {
                    field : 'productCount', 
                    title : '成交数量'
                },
                {
                    field : 'productOutCount', 
                    title : '出库数量',
					editable : {
						type : 'text',
						title : '出库数量',
						emptytext : "【出库数量】为空",
						validate : function(value) {
							if (value.length == 0) {
								return '出库数量不能为空';
							}
							if (!(isNumber(value) && value % 1 === 0)) {
						        return '出库数量必须为数字';
						    }	
						}
					}
                },
                {
                    field : 'orderProductStatus', 
                    title : '状态',
                    formatter: function(value, row, index) {
                       return $.table.selectDictLabel(orderProductStatusDatas, value);
                    },
                    visible: false
                }]
            };
            $.table.init(options);
        });
		
		function onEditableSave (field, row, oldValue, $el) {
        	if(field=="productOutCount"){//出库数量
        		if(parseInt(row[field])<=0){
    				$.modal.msgWarning("出库数量必须大于0");
        		}
        		if(parseInt(row[field])>parseInt(row.productCount)){
    				$.modal.msgWarning("出库数量不能大于订购数量");
    				$.table.refresh();
    				return;
    			}
        		var data = { "orderProductId": row.orderProductId, "productOutCount": row[field]};
    			$.operate.post(prefixOrderProduct + "/updateOrderProductOutCount", data);
        	}
        }
		
        //出库
        function orderOut()
        {        	
        	$.modal.confirm("确认出库吗？", function() {
        		var data = { "orderId": orderId};
        		$.operate.post(prefix + "/editOutSave", data);
        	});        	
        }

	    function isNumber(val){
	        var regPos = /^\d+(\.\d+)?$/; //非负浮点数
	        if(regPos.test(val)){
	            return true;
	        }else{
	            return false;
	        }
	    }
			
	</script>
</body>
</html>